
var app=new Vue({
	el: "#app",
	data: {
		attsNum:0,
		fansNum:0,
		likecountnum:0,
		text:"播放量",
		dataTime:['02-13', '02-14', '02-15', '02-16', '02-17', '02-18', '02-19'],
		colorData:"#80FFA5",
		dataNum:[140, 232, 101, 264, 90, 340, 250],
		userinfo: {},
		releaseData:{}
	},
	methods: {
		selectUser(){
			this.userinfo.userId = window.localStorage.getItem("userid");
			axios.get(API+ "selectUserInfo?userid="+this.userinfo.userId).then(res=>{
				this.userinfo = res.data;
			})
		},
		dataOption(){
			var myChart = echarts.init(document.getElementById('main_data'));
			option = {
				color: ['#80FFA5', '#00DDFF', '#37A2FF', '#FF0087', '#FFBF00'],
				title: {
					text: this.text
				},
				tooltip: {
					trigger: 'axis',
					axisPointer: {
						type: 'cross',
						label: {
							backgroundColor: '#6a7985'
						}
					}
				},
				toolbox: {
					feature: {
						saveAsImage: {}
					}
				},
				grid: {
					left: '3%',
					right: '4%',
					bottom: '3%',
					containLabel: true
				},
				xAxis: [{
					type: 'category',
					boundaryGap: false,
					data: this.dataTime
				}],
				yAxis: [{
					type: 'value'
				}],
				series: [{
					name: this.text,
					type: 'line',
					stack: 'Total',
					smooth: true,
					lineStyle: {
						width: 0
					},
					showSymbol: false,
					areaStyle: {
						opacity: 0.8,
						color: new echarts.graphic.LinearGradient(0, 0, 0, 1, [{
								offset: 0,
								color: this.colorData
							},
							{
								offset: 1,
								color: 'rgb(0, 207, 253,0.1)'
							}
						])
					},
					emphasis: {
						focus: 'series'
					},
					data: this.dataNum//近七天数据
				}]
			};
			// 使用刚指定的配置项和数据显示图表。
			myChart.setOption(option);
		},
		initData() {
			//悬浮数据
			let then=this
			$(".div_data").mouseover(function(){
				let eml=$(this).children().eq(0)
				if(eml.text()=="播放量"){
					then.text=eml.text();
					then.dataNum=this.releaseData.historyCurve;
					then.colorData="#80FFA5"
					then.dataOption()
				}else{
					then.text=eml.text();
					then.dataNum=[240, 32, 101, 264, 90, 40, 250];
					then.colorData="#37A2FF"
					then.dataOption()
				}
				eml.css("color"," #ff2c55")
			})
			$(".div_data").mouseout(function(){
				let eml=$(this).children().eq(0)
				eml.css("color"," black")
			})
			$(".div_data_right").mouseover(function(){
				let eml=$(this).children().eq(0)
				if(eml.text()=="作品点赞"){
					then.text=eml.text();
					then.dataNum=[140, 232, 301, 204, 190, 340, 150];
					then.colorData='#FF0087'
					then.dataOption()
				}else{
					then.text=eml.text();
					then.dataNum=[270, 322, 222, 204, 190, 50, 250];
					then.colorData='#FFBF00'
					then.dataOption()
				}
				eml.css("color"," #ff2c55")
			})
			$(".div_data_right").mouseout(function(){
				let eml=$(this).children().eq(0)
				eml.css("color"," black")
			})
		},
		//粉丝
		getFans(){
			axios.get('http://localhost:8080/doubi/findAtt?userId='+this.userinfo.userId).then(response => {
				localStorage.setItem("attsNum", response.data.length)
				this.attsNum = response.data.length
			}).catch(error => {
				console.error(error);
			});
		},
		//关注
		getAtt(){
			axios.get('http://localhost:8080/doubi/findFans?userId='+this.userinfo.userId).then(response => {
				localStorage.setItem("fansNum", response.data.length)
				this.fansNum = response.data.length
			}).catch(error => {
				console.error(error);
			});
		},
		//获赞
		getLike(){
			axios.get(API+"selectCount?uid="+this.userinfo.userId).then(res=>{
				this.likecountnum=res.data;
			})
		},
		async getData(){
			await axios.get(API+"myReleaseData?userid="+this.userinfo.userId).then(res=>{
				console.log(res.data.dataTime)
				this.releaseData=res.data
				this.dataTime=res.data.dataTime
				this.dataOption();
			})
			console.log(JSON.stringify(this.releaseData))
		}
		
	},
	mounted() {
		
		this.initData();
		this.selectUser();
		this.getFans();
		this.getAtt();
		this.getLike();
		this.getData()
	}
})

$(function(){
	$("#uploadViode").click(function(){
		location.href="../createData/upload.html";
	})
	$("#uploadImg").click(function(){
		location.href="../createData/uploadImg.html";
	})
})